<!-- TabBar 文章资讯 -->
<template>
  <view>
    <view class="cu-form-group">
      <view class="title">订单选择</view>
      <picker @change="PickerChange" :value="index" range-key="orderName" :range="orderList">
        <view class="picker">
          {{ index > -1 ? orderList[index]?.orderName : "选择要追踪的订单" }}
        </view>
      </picker>
    </view>
    <view class="cu-bar bg-white margin-top-xs">
      <view class="action sub-title">
        <text class="text-xl text-bold text-blue text-shadow">订单进度</text>
        <text class="text-ABC text-blue">Process</text>
      </view>
    </view>
    <view v-if="processList.length == 0" class="cu-timeline" style="margin-top: -20upx">
      <u-empty text="暂无进度" mode="list"></u-empty>
    </view>
    <view v-else class="cu-timeline" style="margin-top: -20upx">
      <view v-for="(item, index) in processList" :key="index" class="cu-item cur cuIcon-location">
        <view class="content">
          <view class="cu-capsule radius">
            <view class="cu-tag bg-cyan" v-if="item.isAdmin">管理员</view>
            <view class="cu-tag bg-cyan" v-else-if="item.customerId == userId">客户</view>
            <view class="cu-tag bg-cyan" v-else-if="item.producerId == userId">技术支持</view>
            <view class="cu-tag line-blue">{{ item.process }}</view>
            <view class="cu-tag line-cyan">{{ item.createdTime }}</view>
          </view>
          <view class="margin-top">{{ item.content }}</view>
          <view v-for="(fitem, findex) in item?.fileIdList" :key="findex">
            <FileIdMap :fileId="fitem"></FileIdMap>
          </view>
        </view>
      </view>
    </view>
  </view>
</template>
<script setup>
import FileIdMap from './components/FileIdMap';
import { computed, getCurrentInstance, reactive, ref } from "vue";
import { onLoad, onShow, onPullDownRefresh, onReachBottom, onShareTimeline, onShareAppMessage } from "@dcloudio/uni-app";
import request from "@/lib/request.js";
import { showLoading, closeLoading, handleRes } from "@/lib/common.js";
const { proxy } = getCurrentInstance();
const BASE_URL = proxy.$URL;
const index = ref(0);
const orderList = ref([]);
const processList = ref([]);
// 生命周期
onLoad((options) => {
  queryOrder();
});
// 定义函数列表
function queryOrder() {
  showLoading("获取订单列表");
  request({
    url: "/grad/order/todo",
    method: "GET",
  }).then((res) => {
    closeLoading();
    console.log("---待处理订单---");
    console.log(res.data);
    orderList.value = res.data;
    if (orderList.value.length != 0) {
      queryTime();
    }
  });
}
// 查询进度
function queryTime() {
  showLoading("查询进度");
  let orderId = orderList.value[index.value]?.id;
  const queryParams = {
    pageSize: 999,
    pageNum: 1,
    orderId,
  };
  request({
    url: "/grad/process",
    method: "GET",
    params: queryParams,
  }).then((res) => {
    closeLoading();
    console.log("---进度列表---");
    console.log(res.data.content);
    processList.value = res.data.content;
  });
}

function PickerChange(e) {
  index.value = e.detail.value;
  queryTime();
}

function downloadFile(fileId, processId) {
  console.log(fileId);
  uni.showLoading({
    title: "文件下载中~",
  });
  uni.downloadFile({
    url: BASE_URL + "/grad/process/download?fileId=" + fileId + "&processId=" + processId,
    header: {
      token: uni.getStorageSync("token"),
    },
    success: (res) => {
      var filePath = res.tempFilePath;
      let info = res.header["Content-Disposition"];
      var fileType = info.substring(info.lastIndexOf(".") + 1); //txt
      uni.openDocument({
        filePath: filePath,
        fileType: fileType,
        showMenu: true,
        success: function (res) {
          console.log("打开文档成功");
        },
        fail: (r) => {
          console.log(r);
          uni.showToast({
            title: "不支持小程序端查看",
            icon: "none",
          });
        },
      });
    },
    complete: (res) => {
      console.log(res);
      uni.hideLoading();
    },
  });
}
</script>
<style lang="scss">
.borderBottom {
  border-bottom: 1px solid #f2f2f2;
}
</style>
